/*
* 资产相关操作
* */
import React, {Component} from 'react';
import {observer, inject} from 'mobx-react';
import {withRouter} from 'react-router-dom';
import {getUrlParams, getRouteParams, _scanQRCode} from '../../util';
import {Form} from 'weaver-mobile-page';
import {ActivityIndicator, Button, Tools} from 'weaver-mobile';

const getLabel = Tools.getLabel;

@inject('operationsStore')
@withRouter
@observer
export default class Operations extends Component {
    componentDidMount() {
        this.Init()
    }

    Init = () => {
        const {location, operationsStore} = this.props;
        const {onAdMsg} = operationsStore;
        const {path} = getRouteParams(this.props);
        if (path === 'cptback' || path === 'cptmend') { //如果是归还或送修，则寻找是否id,name
            const params = getUrlParams(location.search);
            if (params.cptid && params.cptname) {
                onAdMsg(true, params.cptid, params.cptname);
            } else {
                onAdMsg(false);
            }
        } else {
            onAdMsg(false);
        }
        operationsStore.init(path);//初始化form数据
    };

    render() {
        const {form, isLoading} = this.props.operationsStore;
        const {formChange, checkTheInfo, scanQRCodeCallback} = this.props.operationsStore;
        return (<div>
            <div style={{marginBottom:(window.getThemeVars ? window.getThemeVars()["button-height"] : 47)}}>
                {isLoading ?
                    (<div className='loading'><ActivityIndicator animating size='large'/></div>)
                    :
                    <Form store={form}
                          onChange={(touch, value) => {
                              formChange(touch, value);
                          }}
                    />
                }
            </div>
            <div className='operations-btn-wrapper'>
                <Button inline type='primary' className='operations-btn-scan'
                        onClick={() => _scanQRCode(scanQRCodeCallback)}>
                    <i className='operations-btn-icon icon-cpt icon-tubiao38'/>
                </Button>
                <Button inline type='ghost' style={{width: "50%", borderRadius: 0}}
                        onClick={this.cancelThat}> {getLabel(31129, "取消")}</Button>
                <Button inline type='primary' style={{width: "50%", borderRadius: 0}} onClick={() => {
                    checkTheInfo(this.props.history)
                }}>{getLabel(826, "确定")}</Button>
            </div>
        </div>);
    }

    cancelThat = () => {
        const {history, operationsStore} = this.props;
        history.go(-1);
        operationsStore.clearForm()
    }
}
